{% extends "base.html" %}

{% block title %}{{ application_name }} - {{ page.name|escape }} - Yearly Giving Report{% endblock %}

{% block body %}
<h1>{{ pay.household.name }}</h1>
<table>
<thead>
<tr>
<th>Date</th>
<th>Amount</th>
<th>Pmt Type</th>
<th>Check Num</th>
<th>Fund</th>
<th>Note</th>
</tr>
</thead>
<tbody>
{% for pay in payments %}
<tr>
<td>{{ pay.deposit.date }}</td>
<td align="right">$<script type="text/javascript"> document.write(twoDP({{ pay.amount }}));</script></td>
<td>{{ pay.paytype }}</td>
<td>{{ pay.checkno }}</td>
<td>{{ pay.fund }}</td>
<td>{{ pay.note }}</td>
</tr>
{% endfor %}
<td>Total</td>
<td align="right">$<script type="text/javascript"> document.write(twoDP({{ total }}));</script></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tbody>
</table>

<script>
    $(document).ready(function(){
 
        //iterate through each textboxes and add keyup
        //handler to trigger sum event
        $(".amount").each(function() {
 
            $(this).keyup(function(){
                calculateSum();
            });
        });
 
    });
 
    function calculateSum() {
 
        var sum = 0;
        //iterate through each textboxes and add the values
        $(".amount").each(function() {
 
            //add only if the value is number
            if(!isNaN(this.value) && this.value.length!=0) {
                sum += parseFloat(this.value);
            }
 
        });
        //.toFixed() method will roundoff the final sum to 2 decimal places
        $("#sum").html(sum.toFixed(2));
    }
</script>
{% endblock %}


